@ibiz-template-plugin/ibiz-file-previewer 0.0.24 → 0.0.26

package/dist/index.es.js

@@ -917,6 +917,8 @@ var ImageMode = /* @__PURE__ */ ((ImageMode2) => {
 var FileType = /* @__PURE__ */ ((FileType2) => {
   FileType2["HTML"] = "html";
   FileType2["MD"] = "md";
+  FileType2["YAML"] = "yaml";
+  FileType2["YML"] = "yml";
   FileType2["TXT"] = "txt";
   FileType2["JSON"] = "json";
   FileType2["XML"] = "xml";
@@ -984,24 +986,32 @@ const FileTypeEngineMap = /* @__PURE__ */ new Map([
   ]],
   // ET类型文件
   // ------TXT类型文件服务端暂未支持START------
-  // [FileType.TXT, [EngineType.TXT]], // TXT类型文件
-  // [FileType.JSON, [EngineType.TXT]], // JSON类型文件
-  // [FileType.XML, [EngineType.TXT]], // XML类型文件
-  ["txt", [
-    "MD"
-    /* MD */
+  ["yaml", [
+    "TXT"
+    /* TXT */
   ]],
-  // TXT类型文件
+  // YAML类型文件
+  ["yml", [
+    "TXT"
+    /* TXT */
+  ]],
+  // YML类型文件
   ["json", [
-    "MD"
-    /* MD */
+    "TXT"
+    /* TXT */
   ]],
   // JSON类型文件
   ["xml", [
+    "TXT"
+    /* TXT */
+  ]],
+  // XML类型文件
+  // [FileType.TXT, [EngineType.TXT]], // TXT类型文件
+  ["txt", [
     "MD"
     /* MD */
   ]],
-  // XML类型文件
+  // TXT类型文件
   // ------TXT类型文件服务端暂未支持END------
   ["pdf", [
     "PDF"
@@ -1178,6 +1188,12 @@ const fileNameToFileType = (fileName) => {
     case "csv":
       fileType = FileType.CSV;
       break;
+    case "yaml":
+      fileType = FileType.YAML;
+      break;
+    case "yml":
+      fileType = FileType.YML;
+      break;
     default:
       fileType = FileType.UNKNOWN;
   }
@@ -1644,6 +1660,42 @@ var posix = {
   posix: null
 };
 posix.posix = posix;
+class EventEmitter {
+  constructor() {
+    __publicField(this, "handlers", {});
+  }
+  /**
+   * 订阅事件
+   * @param event 事件名
+   * @param handler 处理函数
+   * @returns 取消订阅函数
+   */
+  on(event, handler) {
+    if (!this.handlers[event]) {
+      this.handlers[event] = /* @__PURE__ */ new Set();
+    }
+    this.handlers[event].add(handler);
+    return () => this.off(event, handler);
+  }
+  /**
+   * 取消订阅事件
+   * @param event 事件名
+   * @param handler 处理函数
+   */
+  off(event, handler) {
+    var _a;
+    (_a = this.handlers[event]) == null ? void 0 : _a.delete(handler);
+  }
+  /**
+   * 派发事件
+   * @param event 事件名
+   * @param payload 载荷
+   */
+  emit(event, payload) {
+    var _a;
+    (_a = this.handlers[event]) == null ? void 0 : _a.forEach((handler) => handler(payload));
+  }
+}
 var f = 0;
 function u(e2, t2, n2, o2, i2, u2) {
   t2 || (t2 = {});
@@ -2253,7 +2305,7 @@ const FilePreviewImage = (props) => {
         onMouseDown: (evt) => controller.handleMouseDown(evt)
       }
     ),
-    /* @__PURE__ */ u(Teleport, { to: "#custom-controls", children: /* @__PURE__ */ u("div", { className: "image-toolbar-container", children: [
+    /* @__PURE__ */ u(Teleport, { to: "#".concat(controller.controlsId), children: /* @__PURE__ */ u("div", { className: "image-toolbar-container", children: [
       /* @__PURE__ */ u(
         "button",
         {
@@ -16955,7 +17007,7 @@ const FilePreviewMD = (props) => {
   }, []);
   return /* @__PURE__ */ u("div", { className: "file-preview-md ".concat(c2.state.value.theme), children: [
     /* @__PURE__ */ u("div", { ref: previewRef }),
-    /* @__PURE__ */ u(Teleport, { to: "#custom-controls", children: /* @__PURE__ */ u("button", { title: "目录", className: "control-btn", onClick: onOutline, children: /* @__PURE__ */ u("span", { className: "icon", children: /* @__PURE__ */ u(ThumbnailSvg, {}) }) }) })
+    /* @__PURE__ */ u(Teleport, { to: "#".concat(c2.controlsId), children: /* @__PURE__ */ u("button", { title: "目录", className: "control-btn", onClick: onOutline, children: /* @__PURE__ */ u("span", { className: "icon", children: /* @__PURE__ */ u(ThumbnailSvg, {}) }) }) })
   ] });
 };
 function deepFreeze(obj) {
@@ -18753,14 +18805,223 @@ function xml(hljs) {
     ]
   };
 }
+function yaml(hljs) {
+  const LITERALS = "true false yes no null";
+  const URI_CHARACTERS = "[\\w#;/?:@&=+$,.~*'()[\\]]+";
+  const KEY = {
+    className: "attr",
+    variants: [
+      // added brackets support and special char support
+      { begin: /[\w*@][\w*@ :()\./-]*:(?=[ \t]|$)/ },
+      {
+        // double quoted keys - with brackets and special char support
+        begin: /"[\w*@][\w*@ :()\./-]*":(?=[ \t]|$)/
+      },
+      {
+        // single quoted keys - with brackets and special char support
+        begin: /'[\w*@][\w*@ :()\./-]*':(?=[ \t]|$)/
+      }
+    ]
+  };
+  const TEMPLATE_VARIABLES = {
+    className: "template-variable",
+    variants: [
+      {
+        // jinja templates Ansible
+        begin: /\{\{/,
+        end: /\}\}/
+      },
+      {
+        // Ruby i18n
+        begin: /%\{/,
+        end: /\}/
+      }
+    ]
+  };
+  const SINGLE_QUOTE_STRING = {
+    className: "string",
+    relevance: 0,
+    begin: /'/,
+    end: /'/,
+    contains: [
+      {
+        match: /''/,
+        scope: "char.escape",
+        relevance: 0
+      }
+    ]
+  };
+  const STRING = {
+    className: "string",
+    relevance: 0,
+    variants: [
+      {
+        begin: /"/,
+        end: /"/
+      },
+      { begin: /\S+/ }
+    ],
+    contains: [
+      hljs.BACKSLASH_ESCAPE,
+      TEMPLATE_VARIABLES
+    ]
+  };
+  const CONTAINER_STRING = hljs.inherit(STRING, { variants: [
+    {
+      begin: /'/,
+      end: /'/,
+      contains: [
+        {
+          begin: /''/,
+          relevance: 0
+        }
+      ]
+    },
+    {
+      begin: /"/,
+      end: /"/
+    },
+    { begin: /[^\s,{}[\]]+/ }
+  ] });
+  const DATE_RE = "[0-9]{4}(-[0-9][0-9]){0,2}";
+  const TIME_RE = "([Tt \\t][0-9][0-9]?(:[0-9][0-9]){2})?";
+  const FRACTION_RE = "(\\.[0-9]*)?";
+  const ZONE_RE = "([ \\t])*(Z|[-+][0-9][0-9]?(:[0-9][0-9])?)?";
+  const TIMESTAMP = {
+    className: "number",
+    begin: "\\b" + DATE_RE + TIME_RE + FRACTION_RE + ZONE_RE + "\\b"
+  };
+  const VALUE_CONTAINER = {
+    end: ",",
+    endsWithParent: true,
+    excludeEnd: true,
+    keywords: LITERALS,
+    relevance: 0
+  };
+  const OBJECT = {
+    begin: /\{/,
+    end: /\}/,
+    contains: [VALUE_CONTAINER],
+    illegal: "\\n",
+    relevance: 0
+  };
+  const ARRAY = {
+    begin: "\\[",
+    end: "\\]",
+    contains: [VALUE_CONTAINER],
+    illegal: "\\n",
+    relevance: 0
+  };
+  const MODES2 = [
+    KEY,
+    {
+      className: "meta",
+      begin: "^---\\s*$",
+      relevance: 10
+    },
+    {
+      // multi line string
+      // Blocks start with a | or > followed by a newline
+      //
+      // Indentation of subsequent lines must be the same to
+      // be considered part of the block
+      className: "string",
+      begin: "[\\|>]([1-9]?[+-])?[ ]*\\n( +)[^ ][^\\n]*\\n(\\2[^\\n]+\\n?)*"
+    },
+    {
+      // Ruby/Rails erb
+      begin: "<%[%=-]?",
+      end: "[%-]?%>",
+      subLanguage: "ruby",
+      excludeBegin: true,
+      excludeEnd: true,
+      relevance: 0
+    },
+    {
+      // named tags
+      className: "type",
+      begin: "!\\w+!" + URI_CHARACTERS
+    },
+    // https://yaml.org/spec/1.2/spec.html#id2784064
+    {
+      // verbatim tags
+      className: "type",
+      begin: "!<" + URI_CHARACTERS + ">"
+    },
+    {
+      // primary tags
+      className: "type",
+      begin: "!" + URI_CHARACTERS
+    },
+    {
+      // secondary tags
+      className: "type",
+      begin: "!!" + URI_CHARACTERS
+    },
+    {
+      // fragment id &ref
+      className: "meta",
+      begin: "&" + hljs.UNDERSCORE_IDENT_RE + "$"
+    },
+    {
+      // fragment reference *ref
+      className: "meta",
+      begin: "\\*" + hljs.UNDERSCORE_IDENT_RE + "$"
+    },
+    {
+      // array listing
+      className: "bullet",
+      // TODO: remove |$ hack when we have proper look-ahead support
+      begin: "-(?=[ ]|$)",
+      relevance: 0
+    },
+    hljs.HASH_COMMENT_MODE,
+    {
+      beginKeywords: LITERALS,
+      keywords: { literal: LITERALS }
+    },
+    TIMESTAMP,
+    // numbers are any valid C-style number that
+    // sit isolated from other words
+    {
+      className: "number",
+      begin: hljs.C_NUMBER_RE + "\\b",
+      relevance: 0
+    },
+    OBJECT,
+    ARRAY,
+    SINGLE_QUOTE_STRING,
+    STRING
+  ];
+  const VALUE_MODES = [...MODES2];
+  VALUE_MODES.pop();
+  VALUE_MODES.push(CONTAINER_STRING);
+  VALUE_CONTAINER.contains = VALUE_MODES;
+  return {
+    name: "YAML",
+    case_insensitive: true,
+    aliases: ["yml"],
+    contains: MODES2
+  };
+}
 HighlightJS.registerLanguage("xml", xml);
 HighlightJS.registerLanguage("json", json);
+HighlightJS.registerLanguage("yaml", yaml);
 const FilePreviewText = (props) => {
   const c2 = props.controller;
   const previewRef = A(null);
   y$1(() => {
     try {
-      previewRef.current.textContent = c2.state.value.content;
+      if (c2.state.value.fileType === FileType.JSON) {
+        try {
+          const jsonObject = JSON.parse(c2.state.value.content);
+          previewRef.current.textContent = JSON.stringify(jsonObject, null, 2);
+        } catch (error2) {
+          previewRef.current.textContent = c2.state.value.content;
+        }
+      } else {
+        previewRef.current.textContent = c2.state.value.content;
+      }
       HighlightJS.highlightElement(previewRef.current);
     } catch (error2) {
       console.error(error2);
@@ -19214,6 +19475,14 @@ const FilePreviewImageGroup = (props) => {
       observer.disconnect();
     };
   }, []);
+  y$1(() => {
+    const unsubscribe = controller.events.on("goToPage", (page) => {
+      scrollToPage(page);
+    });
+    return () => {
+      unsubscribe();
+    };
+  }, []);
   return /* @__PURE__ */ u("div", { className: "file-preview-image-group", children: [
     /* @__PURE__ */ u(
       "div",
@@ -19276,7 +19545,7 @@ const FilePreviewImageGroup = (props) => {
         ]
       }
     ),
-    /* @__PURE__ */ u(Teleport, { to: "#custom-controls", children: /* @__PURE__ */ u("div", { className: "image-toolbar-container", children: [
+    /* @__PURE__ */ u(Teleport, { to: "#".concat(controller.controlsId), children: /* @__PURE__ */ u("div", { className: "image-toolbar-container", children: [
       /* @__PURE__ */ u(
         "button",
         {
@@ -19497,7 +19766,7 @@ const FilePreviewShell = (props) => {
         ] })
       ] }),
       /* @__PURE__ */ u("div", { className: "preview-controls", children: [
-        /* @__PURE__ */ u("div", { className: "custom-controls", id: "custom-controls" }),
+        /* @__PURE__ */ u("div", { className: "custom-controls", id: controller.controlsId }),
         /* @__PURE__ */ u(
           "button",
           {
@@ -19541,7 +19810,9 @@ const FilePreviewShell = (props) => {
           children: state.value.isCreated && controller.preViewComp && controller.preViewController ? _$2(controller.preViewComp, {
             controller: controller.preViewController,
             onInitialization: () => {
+              var _a, _b;
               controller.updateState({ isLoading: false });
+              (_b = (_a = controller.getOptions()).onInitialized) == null ? void 0 : _b.call(_a);
             }
           }) : null
         }
@@ -19560,9 +19831,19 @@ class FilePreviewItemController {
      * 状态
      */
     __publicField(this, "state", d$1({}));
+    /**
+     * 事件对象，用于向组件派发瞬时动作事件
+     */
+    __publicField(this, "events", new EventEmitter());
     this.filePreviewShell = filePreviewShell;
     this.initState();
   }
+  /**
+   * 工具栏容器唯一 id（代理自 shell controller）
+   */
+  get controlsId() {
+    return this.filePreviewShell.controlsId;
+  }
   /**
    * 更新状态
    * - 所有的状态更新必须调用该方法，以便界面响应
@@ -19741,6 +20022,22 @@ class FilePreviewImageGroupController extends FilePreviewImageController {
     const { showThumbnailPanel } = this.state.value;
     this.updateState({ showThumbnailPanel: !showThumbnailPanel });
   }
+  /**
+   * 跳转至指定页（0-based）
+   * - 越界或内容未加载时静默忽略
+   * - 同步更新 currentPage，并派发 goToPage 事件由组件执行滚动
+   * @param page 目标页索引
+   */
+  goToPage(page) {
+    setTimeout(() => {
+      const { total } = this.state.value;
+      if (!Number.isInteger(page) || total <= 0 || page < 0 || page >= total) {
+        return;
+      }
+      this.updateState({ currentPage: page });
+      this.events.emit("goToPage", page);
+    }, 0);
+  }
   /**
    * 处理旋转角度改变
    * @param value
@@ -20650,6 +20947,7 @@ class FilePreviewItemDispatcher {
  * 引擎预览组件映射表
  */
 __publicField(FilePreviewItemDispatcher, "enginePreviewMap", /* @__PURE__ */ new Map());
+let filePreviewInstanceId = 0;
 class FilePreviewShellController {
   /**
    * 构造函数
@@ -20668,6 +20966,11 @@ class FilePreviewShellController {
      * 文件预览控制器
      */
     __publicField(this, "preViewController");
+    /**
+     * 当前实例工具栏容器唯一 id（不带 #）
+     * - 构造时确定，生命周期内不变
+     */
+    __publicField(this, "controlsId");
     /**
      * 文件预览器状态对象
      */
@@ -20689,6 +20992,8 @@ class FilePreviewShellController {
     if (options.theme) this.updateState({ theme: options.theme });
     FilePreviewItemDispatcher.initialize();
     this.getState = this.getState.bind(this);
+    filePreviewInstanceId += 1;
+    this.controlsId = "custom-controls-".concat(filePreviewInstanceId);
   }
   /**
    * 更新状态
@@ -20874,6 +21179,17 @@ class FilePreviewShellController {
     this.mountComponent();
     this.updateState({ isCreated: true });
   }
+  /**
+   * 跳转至目标页
+   * - 仅对图片组场景生效，其它场景忽略
+   * - 页码为 0-based
+   * @param page 目标页索引
+   */
+  goToPage(page) {
+    if (this.preViewController instanceof FilePreviewImageGroupController) {
+      this.preViewController.goToPage(page);
+    }
+  }
 }
 export {
   ActionType,